<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>百度 AI and Map</title>
    <script src="http://api.map.baidu.com/api?type=webgl&v=1.0&ak=qCf3am1QA8UM5Z6Hn9uBia6lMY183sMv"></script>
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        html,body{
            height: 100%;
        }
        #container{
            overflow: hidden;
            width:100%;
            height: 100%;
        }
    </style>
</head>
<body>
    <div id="container"></div>
    <!-- <script src="./js/utils.js"></script> -->
    <script>
        // Protocol http:// 基于应答响应 request response
        // Domain api.map.baidu.com 二级域名
        // path /api
        // QueryString 
        // let url = 'http://api.map.baidu.com/api?type=webgl&v=1.0&ak=vhRMgLGSYwkF60KXpXHrMULOZM89ZQLv';
        // let qsResult = getQueryStringObj(url);
        // console.log(qsResult);
        var map = new BMapGL.Map('container');
        map.centerAndZoom('南昌',12);
        map.enableScrollWheelZoom(true);
        const data =[{
            log:115.832777,
            lat:28.724024,
            address:'东华理工大学',
            people:'xc',
            doTing:'break the rule'
        },
        {
            lon:115.823175,
            lat:28.737119,
            address:'江西财经大学',
            people:'fu',
            doTing:'上了王者'
        },
        {
        lon: 116.025864,
        lat: 28.686736,
        address: '江西科技学院',
        people: '李晋欣',
        doTing: '百度大佬'
    }
    ]
    data.forEach(function(item){
        var marker = new BMapGL.Marker(
            new BMapGL.Point(
                item.lon,
                item.lat,
            )
        );
        map.addOverlay(marker);
        let content = [item.address,item.people,item.doTing]
        addClickHandler(content,marker,map);
    
})
function addClickHandler(content,marker,map){
    marker.addEventListener('click',function(e){
        console.log(marker,'===============');
    })

}
    </script>
</body>
</html>